<template>
    <div class="layerPublicStyle">
        <lay-form-item label="终端类型" >
            <lay-checkbox name="like" :value="true" @change="checkboxChange"  v-model="formData.merchantType">商户</lay-checkbox>
        </lay-form-item>
        <lay-form-item label="用户账户" class="_row_style">
            <div class="_content">
                {{  formData.username }}
            </div>
        </lay-form-item>
        <lay-form-item label="用户昵称" class="_row_style">
            <div class="_content">
                {{  formData.nickname }}
            </div>
        </lay-form-item>

        <lay-form-item label="绑定商户" >
            <lay-select class="_long_width_select" v-model="formData.merchant_id" placeholder="请选择">
                <lay-select-option :value="it._id" 
                    :label="it.store_name"
                    v-for="(it,i) in merchantList"
                    :key="i"
                ></lay-select-option>
            </lay-select>
        </lay-form-item>

    </div>
</template>

<script setup>
import { getAllMerchantList } from '@/utils/cloud.js'
import { reactive,nextTick,onMounted,ref} from 'vue'
const db = uniCloud.database()

const props = defineProps({
    serverData:Object,
    callback:Function
})

    let merchantList=reactive([])
    const formData=reactive({
        merchantType:true,
        username:props.serverData.username,
        nickname:props.serverData.nickname,
        merchant_id:props.serverData.merchant_id||''
    })

    onMounted(async () => {
        props.callback([
            parentCallVerify,
            parentCallClear
        ]);
        getAllMerchantList().then(({result:{data}})=>{
            merchantList=data
        })
    })

    async function checkboxChange(e){
        await nextTick()
        formData.merchantType=true
    }

    function parentCallVerify(){
        return new Promise(async resolve=>{
            if(formData.merchant_id==``){
            return layer.msg(`请先选择需要绑定的商户`, { icon : 2, time: 1500})
            }
            const [merchant]=merchantList.filter(it=>it._id===formData.merchant_id);

            const results= await new Promise((resolve)=>{
                layer.confirm(`你确定要将该账号绑定到 => ${merchant.store_name} ？`, {
                    title:`绑定提示`,
                    area:[`470px`,`210px`],
                    icon:3,
                    btn: [{
                        text:`确定`,
                        callback:async (layerId)=>{
                            resolve(1);
                            layer.close(layerId);
                        }
                    },{
                        text:`取消`,
                        callback:(layerId)=>{
                            resolve(0)
                            layer.close(layerId);
                        }
                    }]
                }) 
            }) 
            if(results===1){
                try {
                    uni.showLoading({
                        title: `正在绑定`,
                        mask:true
                    });
                    await db.collection(`uni-id-users`)
                    .where({
                        _id:props.serverData._id
                    })
                    .update({
                        merchant_id:merchant._id
                    })
                    layer.msg(`绑定关联成功`, { time: 1500,icon:1 })
                    resolve(1)
                } catch (error) {
                    console.error(error)
                }

                uni.hideLoading()
            }
        })
    }

    function parentCallClear(){
        return new Promise(async resolve=>{
            layer.confirm(`你确定要清除该账号已绑定的商户？`, {
                title:`清除提示`,
                area:[`350px`,`190px`],
                icon:3,
                btn: [{
                    text:`确定`,
                    callback:async (layerId)=>{
                        layer.close(layerId);
                        try {
                            uni.showLoading({
                                title: `正在清除`,
                                mask:true
                            });
                            await db.collection(`uni-id-users`)
                            .where({
                                _id:props.serverData._id
                            })
                            .update({
                                merchant_id:``
                            })
                            layer.msg(`清除绑定成功`, { time: 1500,icon:1 })
                            resolve(1)
                        } catch (error) {
                            console.error(error)
                        }
                        uni.hideLoading()
                    }
                },{
                    text:`取消`,
                    callback:(layerId)=>{
                        layer.close(layerId);
                    }
                }]
            }) 

        })
    }

</script>

<style lang="stylus" scoped>
</style>


